<template>
  <div class="wrapper">
    <el-table :data="authRoleList" :stripe="true" :border="true" :highlight-current-row="true">
      <el-table-column label="ID" prop="id"></el-table-column>
      <el-table-column label="英文角色名" prop="name"></el-table-column>
      <el-table-column label="中文角色名" prop="name_cn"></el-table-column>
      <el-table-column label="创建时间" prop="create_time"></el-table-column>
      <el-table-column label="状态" prop="auth_text"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button v-if="scope.row.authStatus === 0" size="mini" type="success" @click="bindAuth(scope.row)">赋予该权限</el-button>
          <el-button v-else size="mini" type="warning" @click="unbindAuth(scope.row)">解除该权限</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
  import { mapState } from 'vuex'
  import notify from '@/tools/notify'
  export default {
    data () {
      return {}
    },
    created () {
      this.getAuthRoleList()
    },
    computed: {
      ...mapState({
        authRoleList: state => state.auth.authRoleList,
        id () {
          return this.$route.params.id
        }
      })
    },
    methods: {
      // 获取所有角色（不分页）
      async getAuthRoleList () {
        let payload = {
          auth_id: this.id
        }
        await this.$store.dispatch('auth/getAuthRoleList', payload)
      },
      // 赋予某角色该权限
      async bindAuth (row) {
        let payload = {
          role_id: row.id,
          auth_id: this.id
        }
        await this.$store.dispatch('auth/bindAuth', payload).then(res => {
          notify.success(res.msg)
          this.getAuthRoleList()
        })
      },
      // 解除某角色该权限
      async unbindAuth (row) {
        let payload = {
          role_id: row.id,
          auth_ids: this.id
        }
        await this.$store.dispatch('auth/unbindAuth', payload).then(res => {
          notify.success(res.msg)
          this.getAuthRoleList()
        })
      }
    }
  }
</script>